<script setup>
  const props =  defineProps({
      placeholder: {
         type: String,
         default: "请输入账号"
      },

      inputType:{
         type:String,
         default:"text"
      },

      modelValue:String
   })
</script>

<template>
   <input @input="$emit('update:modelValue',$event.target.value)"  :type="inputType" :placeholder="placeholder" class="hd-input" :value="props.modelValue" />
</template>

<style lang="scss">
.hd-input{
  @apply border w-full rounded-sm py-1 px-2 outline-none border-gray-200 placeholder:text-xs
                focus:ring-2 ring-offset-2 ring-violet-600 duration-300
                focus:border-white;
}
</style>